﻿@using System.Threading.Tasks
@using humocloud.Authorization
@using humocloud.Web.Areas.AppAreaName.Startup
@{
    ViewBag.CurrentPageName = AppAreaNamePageNames.Common.OrganizationUnits;
}
@section Styles
{
    <link rel="stylesheet" abp-href="/view-resources/Areas/AppAreaName/Views/OrganizationUnits/Index.css" asp-append-version="true" />
}
@section Scripts
{
    <script abp-src="/view-resources/Areas/AppAreaName/Views/OrganizationUnits/Index.js" asp-append-version="true"></script>
}

<div class="m-subheader">
    <div class="d-flex align-items-center">
        <div class="mr-auto">
            <h3 class="m-subheader__title m-subheader__title--separator">
                <span>@L("OrganizationUnits")</span>
            </h3>
            <span class="m-section__sub">
                @L("OrganizationUnitsHeaderInfo")
            </span>
        </div>

    </div>
</div>


<div class="m-content">
    <div class="row">
        <div class="col-lg-6">
            <div class="m-portlet m-portlet--mobile">
                <div class="m-portlet__head">
                    <div class="m-portlet__head-caption">
                        <div class="m-portlet__head-title">
                            <h3 class="m-portlet__head-text">
                                @L("OrganizationTree")
                            </h3>
                        </div>
                    </div>
                    <div class="m-portlet__head-tools">
                        @if (IsGranted(AppPermissions.Pages_Administration_OrganizationUnits_ManageOrganizationTree))
                        {
                            <button type="button" id="AddRootUnitButton" class="btn btn-primary">
                                <i class="la la-plus"></i> @L("AddRootUnit")
                            </button>
                        }
                    </div>
                </div>
                <div class="m-portlet__body">
                    <div id="OrganizationUnitEditTree"></div>
                    <div id="OrganizationUnitTreeEmptyInfo" ng-if="!vm.organizationTree.unitCount" class="text-muted">
                        @L("NoOrganizationUnitDefinedYet")
                    </div>
                </div>
            </div>
        </div>
        <div class="col-lg-6">
            <div class="m-portlet m-portlet--mobile">
                <div class="m-portlet__head">
                    <div class="m-portlet__head-caption">
                        <div class="m-portlet__head-title">
                            <h3 class="m-portlet__head-text">
                                @L("Members")
                                <span id="SelectedOuRightTitle"></span>
                            </h3>
                        </div>
                    </div>
                    <div class="m-portlet__head-tools">
                        @if (IsGranted(AppPermissions.Pages_Administration_OrganizationUnits_ManageMembers))
                        {
                            <button type="button" id="AddUserToOuButton" class="btn btn-primary" style="display:none">
                                <i class="la la-plus"></i> @L("AddMember")
                            </button>
                        }
                    </div>
                </div>
                <div class="m-portlet__body">
                    <div id="OuMembersTable" style="display:none">
                        <table class="organization-members-table display table table-striped table-bordered table-hover dt-responsive nowrap">
                            <thead>
                            <tr>
                                <th>@L("Delete")</th>
                                <th>@L("UserName")</th>
                                <th>@L("AddedTime")</th>
                            </tr>
                            </thead>
                        </table>
                    </div>

                    <div id="OuMembersEmptyInfo" class="text-muted">
                        @L("SelectAnOrganizationUnitToSeeMembers")
                    </div>
                </div>
            </div>
        </div>
    </div>    
</div>

